<template>
  <div>

    <van-nav-bar
        title="支付页面"
        left-text="返回"
        left-arrow
        @click-left="onClickLeft"
    />
    <h1 style="text-align: center;">
      <div class="payment-success-container">
        <p>支付成功，感谢您的支持！</p>
        <p>将在{{ countDown }}秒后跳转到首页</p>
      </div>
      <el-link type="primary" @click="onClickLeft">立即跳转</el-link>
    </h1>
  </div>
</template>
<script>
export default {
  data() {
    return {
      countDown: 5, // 初始倒计时秒数
    }
  },

  mounted() {
    // 在组件挂载后启动倒计时定时器
    this.startCountDown();
  },
  methods: {
    startCountDown() {
      const timer = setInterval(() => {
        if (this.countDown > 0) {
          this.countDown--;
        } else {
          // 倒计时结束，清除定时器并进行跳转操作（这里假设首页路由名为'home'，需根据实际情况修改）
          clearInterval(timer);
          this.$router.push('/shouye');
        }
      }, 1000);
    },
    onClickLeft() {
      this.$router.push('/shouye')
    },
  },
  created() {
    //倒计时
    //睡眠5秒
    // setTimeout(() => {
    //   this.$router.push('/shouye')
    // }, 5000)
  }
}
</script>
<style scoped>
.payment-success-container {
  text-align: center;
  margin-top: 50px;
}
</style>
